<script setup lang="ts">
  import { ref } from 'vue'
  import Layout from '@/layout/index.vue'

  const active = ref(0)
</script>

<template>
  <div class="app">
    <div class="content">
      <Layout>
        <div class="text-[20px]">
          <router-view />
        </div>
      </Layout>
    </div>
    <van-tabbar v-model="active">
      <van-tabbar-item replace to="/" icon="shop-o">厨房</van-tabbar-item>
      <van-tabbar-item replace to="/recipe" icon="apps-o">菜单</van-tabbar-item>
      <van-tabbar-item replace to="/recipe" icon="apps-o">订单</van-tabbar-item>
      <van-tabbar-item replace to="/cook" icon="fire-o">做饭</van-tabbar-item>
      <van-tabbar-item replace to="/me" icon="user-o">我的</van-tabbar-item>
    </van-tabbar>
  </div>
</template>

<style scoped></style>
